<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<!-- element样式 -->
		<link rel="stylesheet" href="../index.css" />
		
		<script src="../vue.js"></script>
		<!-- element组建 -->
		<script src="../index.js"></script>
	</head>
	<body>
		<div id="app">
			<el-button :plain="true" @click="open1">消息</el-button>
			<el-button :plain="true" @click="open2">成功</el-button>
			<el-button :plain="true" @click="open3">警告</el-button>
			<el-button :plain="true" @click="open4">错误</el-button>
		</div>
	
		<script>
			new Vue({
				el:'#app',
				methods:{
							open1() {
								this.$message('这是一条消息提示');
							},
							open2() {
								this.$message({
									message: '恭喜你，这是一条成功消息',
									type: 'success'
								});
							},
							open3() {
								this.$message({
									message: '警告哦，这是一条警告消息',
									type: 'warning'
								});
							},
							open4() {
								this.$message.error('错了哦，这是一条错误消息');
							}
						}
			});
		</script>
	</body>
</html>
